<template>
    <div>
      用户名：<input type="text" v-model="username">
      <br>
      密码：<input type="password" v-model="password">
      <br>
      图片：<input type="file" id="image">
      <br>
      <button @click="tian">提交</button>
    </div>
</template>

<script>

    export default {
        name: "register",
      data(){
          return{
            username:'',
            password:'',
            image:''
          }
      },
      methods:{
          tian:function () {
            let data = new FormData();
            data.append('username',this.username);
            data.append('password',this.password);
            var image = document.getElementById('image').files[0];
            //三个参数 img：为数据库字段名  image:前端定义名  image.name:图片名称
            data.append('img',image,image.name);
            this.axios({
              url:'http://127.0.0.1:8000/register/',
              method:'post',
              data:data,
              headers:{'Content-Type':'multipart/form-data'}
            }).then(res=>{
              console.log(res);

              if (res.data.code==200){
                alert('提交成功')
                localStorage.setItem('uid',res.data.data)
              }else {
                alert('失败')
              }
            })

          }
      }
    }
</script>

<style scoped>

</style>
